<template>
	<view>
		<!-- <view>
			<u-tabs :list="list" :is-scroll="false" :current="current" @change="change"></u-tabs>
		</view> -->

		<view v-if="current === 0">

			<view>
				<u-dropdown>
					<u-dropdown-item v-model="value1" :title="schoolArea" :options="optList" @change="chooseBranch(value1)" v-if="roleFlag == 1"></u-dropdown-item>
					<u-dropdown-item v-model="value1" :title="coachName" :options="coachList" @change="chooseCoach(value1)" v-if="roleFlag == 2 || roleFlag == 1"></u-dropdown-item>
				</u-dropdown>
			</view>

			<view v-if="evaluate.length != 0">
				<!-- <u-cell-group>
					<view v-for="(item, index) in evaluate" :key="index">
						<u-cell-item icon="/static/notice.png" :title="item.comment" :value="item.star" :arrow="false">
						</u-cell-item>
					</view>
				</u-cell-group> -->
				<u-collapse>
						<u-collapse-item :title="item.star" v-for="(item, index) in evaluate" :key="index">
							{{item.comment}}
						</u-collapse-item>
				</u-collapse>
			</view>
			<view v-else>
				<view class="container u-skeleton">
					<view class="userinfo">
						<u-gap height="20" bg-color="white"></u-gap>
						<block>
							<text class="u-skeleton-fillet">请选择校区和对应的教练！！！</text>
						</block>
					</view>
				</view>
			</view>
		</view>
		<view v-else-if="current === 1">
			<view v-if="flag">
				<u-cell-group title="未读 ·">
					<u-collapse :item-style="itemStyle">
						<u-collapse-item :title="item.title" v-for="(item, index) in uLowStar" :key="index"
							@change="changeRead(item)">
							{{item.content}}
						</u-collapse-item>
					</u-collapse>
				</u-cell-group>
				<u-gap height="40" bg-color="white"></u-gap>
				<u-cell-group title="已读 ·">
					<u-collapse :item-style="itemStyle">
						<u-collapse-item :title="item.title" v-for="(item, index) in lowStar" :key="index">
							{{item.content}}
						</u-collapse-item>
					</u-collapse>
				</u-cell-group>
			</view>
			<view v-else>
				<view class="container u-skeleton">
					<view class="userinfo">
						<u-gap height="20" bg-color="white"></u-gap>
						<block>
							<text class="u-skeleton-fillet">{{logInfo}}</text>
						</block>
					</view>
				</view>
			</view>
		</view>
	</view>

</template>

<script>
	import api from "../../utils/api.js"
	export default {
		data() {
			return {
				schoolArea:"校区",
				coachName:"教练",
				value1: 0,
				// 下拉框的选项
				optList: [],
				coachList: [],
				// 当前下拉框的选择的值
				chooseIndex:'',
				// 分校列表
				branchList:[],
				coachLists:[],
				roleFlag:'',
				evaluate: [],
				current: 0,
				// 导航栏
				list: [{
					name: '评价列表'
				}],
				lowStar: [],
				uLowStar: [],
				logInfo: "",
				flag: true,
				user:{},
				notificationList:[]
			}
		},
		created() {
			let user = uni.getStorageSync("user")
			this.user = user
			this.roleFlag = user.roleId
			// console.log(user.id)
			// 拿到当前用户的评价 根据自己的id
			api.getCocahEvaluateById(user.id).then((res) => {
				console.log(res)
				let data = res.data
				for (var i = 0; i < data.length; i++) {
					this.evaluate.push(data[i])
				}
				for (var i = 0; i < this.evaluate.length; i++) {
					var res = "评价：" + this.evaluate[i].star + "星"
					this.evaluate[i].star = res;
				}
				console.log("评价")
				console.log(this.evaluate)
			})
			console.log(user.roleId)
			if (user.roleId == 1) {
				api.getNoticeList(user.branchId, this.globalConst.LOW_EVALUATE_TYPE).then(res => {
					//console.log(res)
					console.log("差评列表")
					let data = res.data
					console.log(da)
					for (var i = 0; i < data.length; i++) {
						if (data[i].readStatus === 0) {
							this.uLowStar.push(data[i])
							continue;
						}
						this.lowStar.push(data[i])
					}
				})
			} else {
				this.flag = false
				this.logInfo = "您没有查看差评的权限！"
			}
			
			if (this.roleFlag == 1){
				this.requestBranchList()
			}else if (this.roleFlag == 2){
				this.requestCoachDataList(user.branchId)
			}else{
				this.requestCoachNotification(this.user.id).then(res => {
					let data = res.data
					console.log("----------------evalute---------------")
					console.log(data)
					for (var i = 0;i < data.length;i++){
						this.evaluate.push(data[i])
					}
				})
			}
			
			//this.requestBranchList()
			//this.requestNotificationByBranchId()
			//this.requestCoachDataList()
		},
		methods: {
			chooseBranch(e){
				console.log("当前选择的是这个"+e)
				console.log(this.branchList[e])
				// 清空对应的数据
				this.schoolArea = this.branchList[e].branchName
				this.coachName = "教练"
				this.evaluate.splice(0, this.evaluate.length)
				this.coachList.splice(0, this.coachList.length)
				this.coachLists.splice(0, this.coachLists.length)
				this.requestCoachDataList(this.branchList[e].id)
				
			},
			chooseCoach(e){
				this.evaluate.splice(0, this.evaluate.length)
				this.coachName = this.coachLists[e].realName
				this.requestCoachNotification(this.coachLists[e].id)
			},
			// 获得指定校区的教练列表
			requestCoachDataList(branchId){
				api.getAllCoachListByBranchId(branchId).then(res => {
					console.log("---------------coach的列表---------------")
					console.log(res)
					let data = res.data
					
					for (var i = 0;i < data.length;i++){
						var params = {
							value:i,
							label:data[i].realName
						}
						this.coachList.push(params)
						this.coachLists.push(data[i])
					}
				})
			},
			// 根据教练的id 获得对应的评价
			requestCoachNotification(coachId){
				api.getAllNotificationByCoachId(coachId).then(res => {
					console.log("----------coach的通知----1-------")
					console.log(res)
					let data = res.data
					for (var i = 0;i < data.length;i++){
						this.notificationList.push(data[i])
						data[i].star = "评价人："+data[i].commentUserName + " 星数："+data[i].star+"星"
						data[i].comment = "评价内容："+ data[i].comment
						this.evaluate.push(data[i])
					}
					
				})
			},
			requestBranchList(){
				api.getAllBranchList().then(res => {
					let data = res.data
					for (var i = 0;i < data.length;i++){
						var params = {
							value:i,
							label:data[i].branchName
						}
						this.optList.push(params)
						this.branchList.push(data[i])
					}
					console.log(res)
				})
			},
			requestNotificationByBranchId(){
				console.log("----------------------branch-----------------------")
				api.getAllNotificationByBranchId(1).then(res => {
					console.log(res)
				})
			},
			change: function(index) {
				this.current = index;
			},
			changeRead: function(item) {
				item.readStatus = 1;
				api.changeNoticeReadStatus(item).then(res => {
					console.log(res)
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		padding: 20rpx 60rpx;
	}

	.userinfo {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.userinfo-avatar {
		width: 128rpx;
		height: 128rpx;
		margin: 20rpx;
		border-radius: 50%;
	}

	.lists {
		margin: 10px 0;
	}
</style>
